<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="ie=edge">
		<link href="css/bootstrap.css" rel="stylesheet">
		<link href="css/layui.css" rel="stylesheet">
		<link href="css/layui.mobile.css" rel="stylesheet">
		<link rel="stylesheet" href="font-awesome/css/font-awesome.min.css">
		<link rel="stylesheet" href="css/styles.css">
		<title>班级-大学课堂评价系统</title>


		<style>
			a:hover{text-decoration:none;}
        a.active{text-decoration:none;}
        html,body{height: 100%;margin: 0;}
        .row{margin-bottom: 10px}

        body{background: #f9f9f9;font-family: -apple-system,"Microsoft Yahei","Helvetica Neue",Helvetica,Arial,sans-serif;}


        @font-face {
            font-family: "lantingxihei";
            src: url("fonts/FZLTCXHJW.TTF");
        }

		/* 导航栏 */
		.header {
			background-color: #DEDEDE;
		}
		.container {
			padding-right: 40px;
			padding-left: 40px;
		}
		.navbar-nav{
			margin-left: 20px;
		}
		
        /* modal 模态框*/
        #invite-user .modal-body {
            overflow: hidden;
        }
        #invite-user .modal-body .form-label {
            margin-bottom: 16px;
            font-size:14px;
        }
        #invite-user .modal-body .form-invite {
            width: 80%;
            padding: 6px 12px;
            background-color: #eeeeee;
            border: 1px solid #cccccc;
            border-radius: 5px;
            float: left;
            margin-right: 10px;
        }
        #invite-user .modal-body .msg-modal-style {
            background-color: #7dd383;
            margin-top: 10px;
            padding: 6px 0;
            text-align: center;
            width: 100%;
        }
        #invite-user .modal-body .modal-flash {
            position: absolute;
            top: 53px;
            right: 74px;
            z-index: 999;
        }
        /* end modal */

        .en-footer {
            padding: 30px;
            text-align: center;
            font-size: 14px;
        }
    </style>


	</head>

	<body>
		<jsp:include page="top.jsp"/>
		<div class="container layout layout-margin-top">
			<ol class="breadcrumb">
				<li><a href="#">主页</a></li>
				<li class="active">个人中心</li>
			</ol>
			<!--中心-->
			<div class="row">
				<div class="col-md-3">
					<div class="layui-card cate-con">
						<div class="layui-card-body" style="padding: 30px 15px;">
							<img src="img/touxiang.jpg" class="img-circle img-responsive center-block touxiang" alt="..." />
							<h2 class="text-center">${name}</h2>
							<form action="LogoutServlet" method="post">
							<button type="submit"  class="btn btn-warning center-block" style="margin-top: 25px;">退出登录</button>
							</form>
							
						</div>
						
					</div>
				</div>
				<div class="col-md-9">
					<div class="layui-card cate-con">
						<div class="layui-card-body">
							<div class="panel panel-success">
								<!-- Default panel contents -->
								<div class="panel-heading"><h1>账号管理</h1></div>
								
							</div>
							<form class="form-horizontal" action="ClassInfoServlet?action=alterPwd" method="post">
  <div class="form-group">
    <label for="inputEmail3" class="col-sm-2 control-label">旧密码：</label>
    <div class="col-sm-10">
      <input type="password" class="form-control" id="inputPassword1" name="oldPwd" placeholder="请输入原来的密码">
    </div>
  </div>
  <div class="form-group">
    <label for="inputPassword3" class="col-sm-2 control-label">新的密码</label>
    <div class="col-sm-10">
      <input type="password" class="form-control" id="inputPassword2" name="newPwd" placeholder="密码只能是8-16个字母和数字组成!">
    </div>
  </div>
  <div class="form-group">
  <label for="inputPassword3" class="col-sm-2 control-label">确认新密码</label>
  <div class="col-sm-10">
  	<input type="password" class="form-control" id="inputPassword3" name="confirmPwd" onkeyup="validate()" placeholder="请确认新密码">
  	<span id="tishi"></span>
  </div>
  </div>
  <div class="form-group">
    <div class="col-sm-offset-2 col-sm-10">
      <button type="submit" id="submit" class="btn btn-default" disabled="disabled">保存</button>
    </div>
  </div>
</form>
						</div>
					</div>
				</div>
			</div>
			<!--中心-row-->
		</div>
		<!--container-->
		<div class="modal fade" id="sign-modal" tabindex="-1" role="dialog">
			<div class="modal-dialog modal-sm" role="document">
				<div class="modal-content">
					<button type="button" class="close-modal" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
					<div class="modal-body">
						<ul class="nav nav-tabs" role="tablist">
							<li role="presentation" class="active">
								<a href="#signin-form" aria-controls="signin-form" role="tab" data-toggle="tab">登录</a>
							</li>
						</ul>
						<div class="tab-content">
							<div role="tabpanel" class="tab-pane active" id="signin-form">
								<form action="/login" method="post">
									<div class="form-group">
										<div class="input-group">
											<div class="input-group-addon">
												<i class="fa fa-envelope" style="margin:0;"></i>
											</div>
											<input type="email" name="login" class="form-control" placeholder="请输入账户">
										</div>
									</div>
									<div class="form-group">
										<div class="input-group">
											<div class="input-group-addon">
												<i class="fa fa-lock" style="margin:0;"></i>
											</div>
											<input type="password" name="password" class="form-control" placeholder="请输入密码">
										</div>
									</div>
									<div class="form-inline verify-code-item" style="display:none;">
										<div class="form-group">
											<div class="input-group">
												<input type="text" name="captcha_v" class="form-control" placeholder="请输入验证码">
											</div>
										</div>
										<img class="verify-code" src="" source="https://www.shiyanlou.com/captcha.gif">
									</div>
									<div class="form-group remember-login">
										<input name="remember" type="checkbox" value="y"> 下次自动登录
										<a class="pull-right" href="../reset_password/index.html">忘记密码？</a>
									</div>
									<div class="form-group">
										<input class="btn btn-primary" name="submit" type="submit" value="登录">
									</div>
									<div class="form-group error-msg">
										<div class="alert alert-danger" role="alert"></div>
									</div>
								</form>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<jsp:include page="footer.jsp"/>
		<script src="js/jquery-3.2.1.min.js"></script>
		<script src="js/bootstrap.js"></script>
		<script src="js/layui.all.js"></script>
<script type="text/javascript">
function validate() {
    var pwd = $("#inputPassword2").val();
    var pwd1 = $("#inputPassword3").val();
    /* 对比两次输入的密码 */
    if(pwd == pwd1)
     {
        $("#tishi").html("两次密码相同");
        $("#tishi").css("color","green");
    	$("#submit").removeAttr("disabled");
     }else {
        $("#tishi").html("两次密码不相同");
        $("#tishi").css("color","red")
        $("#submit").attr("disabled","disabled");  
      }
}
</script>
</body>
</html>
